<template>
	<view>
		<view class="number-container">
			<view v-for="(number, index) in share_img_list" :key="index" class="number-option"
				@click="selectedImg(index)">
				<image :src="number.data.fileUrl" class="number-icon"></image>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		store
	} from "../../uni_modules/uni-id-pages/common/store";
	export default {
		data() {
			return {
				share_img_list: [],
			};
		},

		methods: {
			getList() {
				//调用云函数方法
				uniCloud.callFunction({
					name: "share_img_list", //参数是云函数的名 会自动找这个云函数
				}).then((res) => {
					const {
						result
					} = res //定义result 
					console.log(result)
					for (let i = 0; i < result.data.length; i++) {
						if (result.data[i].userid == store.userInfo._id) {
							this.share_img_list = [...this.share_img_list, result.data[i]]
						}
					}
				})
			},

			selectedImg(index) {
				let that = this;
				console.log("selectedImg", index)

				uni.navigateTo({
					url: '/pages/create/picture_display/picture_display',
					success: function(res) {
						// 通过eventChannel向test.vue页面传送数据（参数）
						res.eventChannel.emit('collectPageData', that.share_img_list[index])
					}
				})
			}
		},

		onLoad() {
			this.getList();
		}
	}
</script>

<style lang="scss">
	.number-container {
		display: flex;
		flex-wrap: wrap;
		justify-content: start;
	}

	.number-option {
		width: calc(33.33% - 10px);
		/* Adjust according to your needs */
		margin-bottom: 5px;
		/* Adjust according to your needs */
	}

	.number-icon {
		padding: 30rpx;
		width: 200rpx;
		height: 200rpx;
	}
</style>